<template>
  <z-tree-select
    v-model:value="value"
    style="width: 240px"
    :tree-data="treeData"
    tree-default-expand-all
    show-search
    treeNodeLabelProp="title"
    treeNodeFilterProp="title"
  />
</template>
<script>
import { defineComponent, ref } from 'vue'

export default defineComponent({
  name: 'TreeSelectDemo2',
  setup(){
    const value = ref([])
    const treeData = ref([
      {
        title: 'parent 1',
        value: 'parent 1',
        children: [
          {
            title: 'parent 1-0',
            value: 'parent 1-0',
            children: [
              {
                title: 'my leaf',
                value: 'leaf1'
              },
              {
                title: 'your leaf',
                value: 'leaf2'
              }
            ]
          },
          {
            title: 'parent 1-1',
            value: 'parent 1-1'
          },
          {
            title: '哈哈哈',
            value: '123'
          }
        ]
      }
    ])
    return {
      value,
      treeData
    }
  }
})
</script>
